<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="icon" type="images/x-icon" href="./static/images/favicon.ico" />
    <link rel="stylesheet" href="./static/css/bootstrap.min.css" />
    <link
      rel="stylesheet"
      href="./static/font-awesome/css/font-awesome.min.css"
    />
    <link rel="stylesheet" href="./static/css/github-dark-dimmed.min.css" />
    <link rel="stylesheet" href="./static/css/style.css" />
    <title>handsome-AI</title>
  </head>
  <body>
    <div class="container">
      <div class="row">
        <div class="box col-xs-12">
          <div class="title">
            <h2 class="text-center">
              <span style="margin-right: 10px"
                ><i
                  class="fa fa-optin-monster fa-lg"
                  aria-hidden="true"
                ></i></span
              >handsome-AI
            </h2>
          </div>
          <div class="answer">
            <div class="tips">
              <h4 class="text-center">欢迎！更多功能请点击下方设置按钮</h4>
              <!--<img src="./static/images/reward.png" />-->
            </div>
            <div id="chatWindow"></div>
            <div class="function">
              <div class="others">
                <div class="left">
                  <div class="settings common dropup">
                    <a
                      class="dropdown-toggle icon-style"
                      id="dropdownMenu"
                      data-toggle="dropdown"
                      aria-haspopup="true"
                      aria-expanded="false"
                      title="设置"
                    >
                      <i class="fa fa-cogs fa-lg" aria-hidden="true"></i>
                    </a>
                    <div
                      class="dropdown-menu"
                      style="padding: 0"
                      onclick="event.stopPropagation()"
                    >
                      <div class="settings-common">
                        <span
                          ><i
                            class="fa fa fa-linode fa-lg"
                            aria-hidden="true"
                          ></i
                          >&nbsp; 主题</span
                        >
                        <select class="form-control ipt-common theme">
                          <option value="light">light</option>
                          <option value="gray">gray</option>
                          <option value="light-red">light-red</option>
                          <option value="light-blue">light-blue</option>
                          <option value="light-purple">light-purple</option>
                          <option value="light-green">light-green</option>
                          <option value="light-yellow">light-yellow</option>
                        </select>
                      </div>
                      <div class="settings-common">
                        <span
                          ><i class="fa fa-key fa-lg" aria-hidden="true"></i
                          >&nbsp; 智谱AI Key</span
                        >
                        <input
                          type="text"
                          class="form-control ipt-common api-key"
                          placeholder="可用自己的api key"
                        />
                      </div>
                      <div class="settings-common">
                        <span
                          ><i
                            class="fa fa-reddit-alien fa-lg"
                            aria-hidden="true"
                          ></i
                          >&nbsp; 智谱AI 模型</span
                        >
                        <select class="form-control ipt-common" id="model-select" onchange="modelSelectChange(this)">
                          <option value="glm-4.5-flash">GLM-4.5-Flash</option>
                          <option value="cogview-3-flash">Cogview-3-Flash</option>
                          <option value="cogvideox-flash">CogVideoX-Flash</option>
                        </select>
                      </div>
                      <!-- <div class="settings-common">
                        <span
                          ><i
                            class="fa fa-floppy-o fa-lg"
                            aria-hidden="true"
                          ></i
                          >&nbsp; 记录对话内容，刷新不会消失</span
                        >
                        <div class="chck-btn">
                          <input id="chck-1" type="checkbox" />
                          <label for="chck-1" class="check-trail">
                            <div class="check-handler"></div>
                          </label>
                        </div>
                      </div> -->
                      <div class="settings-common">
                        <span
                          ><i class="fa fa-retweet fa-lg" aria-hidden="true"></i
                          >&nbsp; 开启连续对话，加倍消耗tokens</span
                        >
                        <div class="chck-btn">
                          <input id="chck-2" type="checkbox" />
                          <label for="chck-2" class="check-trail">
                            <div class="check-handler"></div>
                          </label>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="right">
                  <div class="delete common">
                    <a class="icon-style" title="删除历史记录"
                      ><i class="fa fa-trash-o fa-lg" aria-hidden="true"></i
                    ></a>
                  </div>
                </div>
              </div>
              <div class="ipt">
                <div class="col-xs-12">
                  <textarea
                    id="chatInput"
                    class="form-control"
                    rows="1"
                  ></textarea>
                </div>
                <button id="chatBtn" class="btn btn-primary" type="button">
                  Go !
                </button>
              </div>
            </div>
          </div>
          <footer class="foot" style="margin-top: 20px">
            <p class="lead text-center">
              “抢走工作的不会是AI,而是率先掌握AI能力的人”
            </p>
            <p class="lead text-center">
              <a href="https://gitee.com/wangshen-handsome" target="_blank"
                ><i class="fa fa-link fa-lg" aria-hidden="true"></i>&nbsp;
                联系我</a
              >
              <!-- <a
                href="https://gitee.com/wangshen-handsome/handsome-chat-gpt"
                target="_blank"
                ><i class="fa fa-github fa-lg" aria-hidden="true"></i>&nbsp;
                项目地址</a
              > -->
            </p>
          </footer>
        </div>
      </div>
    </div>
  </body>
  <script src="./static/js/jquery-2.1.1.js"></script>
  <script src="./static/js/bootstrap.min.js"></script>
  <script src="./static/js/highlight.min.js"></script>
  <script src="./static/js/marked.min.js"></script>
  <script src="./static/js/html2canvas.min.js"></script>
  <script src="./static/js/config.js"></script>
  <script src="./static/js/custom.js"></script>
</html>
